<div class="page">
    <div class="page__hd">
        <h1 class="page__title">Dialog</h1>
        <p class="page__desc">对话框</p>
    </div>
    <div class="page__bd page__bd_spacing">
        <a href="javascript:;" class="weui-btn weui-btn_default" id="showDialog1">iOS Dialog样式一</a>
        <a href="javascript:;" class="weui-btn weui-btn_default" id="showDialog2">iOS Dialog样式二</a>
        <a href="javascript:;" class="weui-btn weui-btn_default" id="showDialog3">Android Dialog样式一</a>
        <a href="javascript:;" class="weui-btn weui-btn_default" id="showDialog4">Android Dialog样式二</a>
    </div>
    <div class="page__ft">
        <a href="javascript:home()"><img src="./images/icon_footer_link.png" /></a>
    </div>

    <!--BEGIN dialog1-->
    <div id="dialog1" style="display: none;">
        <div class="weui-mask"></div>
        <div class="weui-dialog">
            <div class="weui-dialog__hd"><strong class="weui-dialog__title">弹窗标题</strong></div>
            <div class="weui-dialog__bd">弹窗内容，告知当前状态、信息和解决方法，描述文字尽量控制在三行内</div>
            <div class="weui-dialog__ft">
                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_default">辅助操作</a>
                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary">主操作</a>
            </div>
        </div>
    </div>
    <!--END dialog1-->
    <!--BEGIN dialog2-->
    <div id="dialog2" style="display: none;">
        <div class="weui-mask"></div>
        <div class="weui-dialog">
            <div class="weui-dialog__bd">弹窗内容，告知当前状态、信息和解决方法，描述文字尽量控制在三行内</div>
            <div class="weui-dialog__ft">
                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary">知道了</a>
            </div>
        </div>
    </div>
    <!--END dialog2-->
    <!--BEGIN dialog3-->
    <div id="dialog3" style="display: none;">
        <div class="weui-mask"></div>
        <div class="weui-dialog weui-skin_android">
            <div class="weui-dialog__hd"><strong class="weui-dialog__title">弹窗标题</strong></div>
            <div class="weui-dialog__bd">
                弹窗内容，告知当前状态、信息和解决方法，描述文字尽量控制在三行内
            </div>
            <div class="weui-dialog__ft">
                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_default">辅助操作</a>
                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary">主操作</a>
            </div>
        </div>
    </div>
    <!--END dialog3-->
    <!--BEGIN dialog4-->
    <div id="dialog4" style="display: none;">
        <div class="weui-mask"></div>
        <div class="weui-dialog weui-skin_android">
            <div class="weui-dialog__bd">
                弹窗内容，告知当前状态、信息和解决方法，描述文字尽量控制在三行内
            </div>
            <div class="weui-dialog__ft">
                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_default">辅助操作</a>
                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary">主操作</a>
            </div>
        </div>
    </div>
    <!--END dialog4-->
</div>